<template>
  <div>
      <el-row>
        <el-radio-group v-model="selectedType">
          <el-button v-for="(item,index) in types" :key="index" :type="item.actvie ? 'primary' : ''" @click="changeType(item,index)">{{item.label}}</el-button>
        </el-radio-group>
      </el-row>
      <div class="content_border">
        <AppointmentInfo v-if="selectedType == 0" :fromdata="dataObj" @operateAction="operateAction" />
        <ClientInfo v-if="selectedType == 1" :fromdata="dataObj.client" />
        <CarInfo v-if="selectedType == 2" :fromdata="dataObj.car" />
        <ProjectInfo v-if="selectedType == 3" :fromdata="dataObj.carProjects" />
      </div>    
  </div>
</template>

<script>
  import {
  editSubscribeById,
  
} from '@/api/after-sale/customer-center/index'
  import baseMixin from '@/mixins/base'
  import { parseTimeToYMDHMS } from '@/utils'
  import CarInfo from './car-info';
  import ClientInfo from './client-info';
  import ProjectInfo from './project-info';
  import AppointmentInfo from './appointment-info';

  export default {
    name: 'viewClientManage',
    components: {CarInfo, ClientInfo, ProjectInfo, AppointmentInfo, },
    mixins: [
    ],
    props:{
      value:{
        type:Object,
        default:{},
      }
    },
    data() {
      return {
        types: [
          {label: '预约信息', value: 0, actvie: true},
          {label: '客户信息', value: 1, actvie: false},
          {label: '车辆信息', value: 2, actvie: false},
          {label: '预约项目', value: 3, actvie: false},
        ],
        selectedType: 0,
        dataObj:{
          client:{},
          car:{},
          carProjects:[],
        },//详情id
      }
    },
    methods: {
      operateAction(data){
        console.log('拿到回传信息',data)
        this.$emit('operate',data)
      },
      changeType(item, index){
        this.selectedType = index;
        this.types.map((e,i) => {
          if (i == index) {
            e.actvie = true;
          } else {
            e.actvie = false;
          }
        })
      },
    },
    async mounted() {
      this.id=this.value.id;
      let {data}=await editSubscribeById(this.id);
      data.subscribeDate=data.subscribeDate.split(' ')[0];
      this.dataObj=data;
    }
  }
</script>

<style lang="scss" scoped>
  .content_border {
    border: 1px solid #DCDFE6;
    padding: 15px;
    margin-top: 20px;
  }
</style>
